<!DOCTYPE HTML>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>无标题文档</title>

	<style type="text/css">
		body{
			font-family: "Microsoft YaHei", 微软雅黑, "Microsoft JhengHei", 华文细黑, STHeiti, MingLiu;
			font-size: 12px;
			margin: 0;
			overflow: hidden;
			
			box-shadow: 2px 2px 3px outset;
			border-radius: 4px;
		}

		.win{
			position: absolute;
			top: 1px;
			left: 1px;
			bottom: 1px;
			right: 1px;
			background-color: white;
			border-radius: 5px;
			border: 1px solid #615B57;
			padding:1px;
		}

		.head{
			position: relative;
			width: 100%;
			height: 20px;
			background: transparent;
			background-color: #F7F4F3;
			border-bottom: 1px solid #615B57;
		}

		.title{
			float: left;
			margin-left: 10px;

		}
		
		.close{
			float: right;
			background: url("../images/Btn_Window_Close.png") no-repeat 0px 0px;
			height: 20px;
			width: 20px;
		}

		.close:hover{
			background: url("../images/Btn_Window_Close.png") no-repeat -20px 0px;
		}

		.main{
			position: absolute;
			top: 25px;
			left: 8px;
			height: 73px;
			width: 280px;
		}

		.photo{
			margin-top: 5px;
			margin-left: 10px;
			float: left;
			margin-right: 10px;
		}

		.photo img{
			border-radius: 5px;
		}

		.content{
			margin-left: 55px;
			height: 55px;
		}

		.body{
			height: 55px;
			overflow:hidden;
		}

		.option{
			position: absolute;
			top: 96px;
			left: 0px;
			height: 26px;
			width: 100%;
		}

		.option div{
			float: left;
			text-align: center;
			border-top: 1px solid #B0B0AD;
			height: 24px;
			line-height: 24px;
		}

		.option div.reply{
			width: 130px;
			border-right: 1px solid #B0B0AD;
		}

		.option div.detail{
			width: 165px;
			border-top: 1px solid #B0B0AD;
		}

		.option div:hover{
			background-color: #F7F4F3;
		}

	</style>
	<script src="../../lib/jquery-1.8.0.min.js"></script>
	<script src="../../lib/artTemlate/template.min.js"></script>
</head>
<body>
	<div class="win">
		<div class="head" id="win_head">
			<div class="title">消息通知</div>
			<div class="close"></div>
		</div>
		<div class="main">
			<div class="photo">
				<img src="../images/portrait.gif" >
			</div>
			<div class="content">
				<div class="name">ForEleven</div>
				<div class="body"></div>
			</div>
		</div>
		<div class="option">
			<div class="reply">回 复</div>
			<div class="detail">查看详情</div>
		</div>
	</div>
</body>
	<script type="text/javascript" src="../URLs.js"></script>
	<script type="text/javascript" src="../api.js"></script>
	<script type="text/javascript" src="../parse.js"></script>
	<script type="text/javascript" src="../helper.js"></script>
	<script type="text/javascript" src="../templates.js"></script>
	
	<script type="text/javascript">

var notifi = {
	width : 300,
	height : 125,
	timerid : 0,
	uid : 0,
	curid : 0,
	ignore : new Array()
};

notifi.view = (function(){
	return {
		init : function(){
			$('.close').click(function(){
				notifi.ignore.unshift(notifi.curid);
				notifi.curid = 0;
				AlloyDesktop.hide();
			});

			// 处理 窗体拖动事件
			win_head.onmousedown = function() {
				AlloyDesktop.drag();
			};
			win_head.onmouseup = function() {
				AlloyDesktop.stopDrag();
			};
		},

		show: function(active){
			$('.photo img').attr('src', active.portrait);
			$('.name').html(active.author);
			if(active.catalog==3){
				$('.body').html('在动弹中@了您：'+active.message);
			}else{
				$('.body').html('在回复了中@了您：'+active.message);
			}
		}
	};
})();

notifi.timer = (function(){

	var isIgnore = function(id){
		for (var i = 0; i < notifi.ignore.length; i++) {
			if(notifi.ignore[i]==id){
				return true;
			}
		};
		return false;
	};


	return {
		init : function(){
			notifi.timerid = setInterval(function(){
				clearInterval(notifi.timerid);
				//处理用户消息通知
				api.getUserNotice(notifi.uid,function(data){
							var notice = Parse.notice(data);
							if(notice.atmecount>0){
								api.getActiveList(notifi.uid,2,0,notice.atmecount,function(data){
									var list = Pactive.parseList(data);
									if (list.length>0 && notifi.curid!=list[0].id) {
										if(!isIgnore(list[0].id)){
											notifi.curid = list[0].id;
											notifi.view.show(list[0]);
											AlloyDesktop.restore();
											AlloyDesktop.focus();
											AlloyDesktop.setTopMost();
										}
									};
									
								});
							}

							notifi.timer.init();
						});		
			}, 3000);


			
		}
	};
})();

notifi.init = (function(){
	return {
		init : function(){

			notifi.uid = help.alloy.getParam('uid');
			notifi.view.init();
			notifi.timer.init();
			//var type  = help.alloy.getParam('type');
			
		},
		readyHandler : function(){
			AlloyDesktop.setTitle("消息通知");
			//AlloyDesktop.setWindowStyle("0x00000080L");
			AlloyDesktop.hide();
			var win = AlloyDesktop.getScreenSize();
			var x = (win.width-notifi.width-5);
			var y = (win.height-notifi.height-5);
			AlloyDesktop.move(x,y);
			AlloyDesktop.setSize(notifi.width,notifi.height);
			
			
			//AlloyDesktop.enableResize();
			notifi.init.init();
		}
	};
})();



addEventListener("AlloyDesktopReady", notifi.init.readyHandler);
</script>
</html>